<template>
  <div>
    <codemirror ref="chartOption" :value="sourceCode" :options="cmOptions">
    </codemirror>
  </div>
</template>

<script>
import { codemirror } from "vue-codemirror";
import "codemirror/lib/codemirror.css";
import "codemirror/mode/clike/clike.js"; //java
import "codemirror/theme/blackboard.css";
import "codemirror/theme/eclipse.css";

import "codemirror/mode/javascript/javascript.js"; //
export default {
  name: "basic-line-configs",
  props: {
    sourceCode: {
      type: String,
      default: ""
    }
  },
  components: {
    codemirror
  },
  data() {
    return {
      cmOptions: {
        tabSize: 2, // Tab键空格数
        mode: "text/x-java", //模式
        theme: "blackboard", // 主题
        lineNumbers: true, //是否显示行号
        line: true,
        readOnly: true // 只读
      }
    };
  }
};
</script>

<style scoped></style>
